var iot_zongsang = document.querySelector('.iot_zongsang')
iot_zongsang.onclick =function (e) {
	var clicledObj = e.target;
	var num = parseInt(clicledObj.getAttribute('data-id'))
	// console.log(num)
	var tabs =document.querySelector('.iot_zongsang').children
	// console.log(tabs)
	tabs[num].classList.add('active')
	tabs[1 - num].classList.remove('active')
	var tabs =document.querySelector('.iot_xuanxiang').children
	// console.log(tabs)
	tabs[num].classList.add('on')
	tabs[1 - num].classList.remove('on')
}

var eprev = document.querySelector('.iot_prev');
var enext = document.querySelector('.iot_next');
var esico = document.getElementById('iot_yuandian').getElementsByTagName('li');
var eicolist1 = document.querySelector('#iot_yuandian1');
var eicolist2 = document.querySelector('#iot_yuandian2');
var eicolist3 = document.querySelector('#iot_yuandian3');
var eicolist4 = document.querySelector('#iot_yuandian4');
var eimglist = document.querySelector('#c');
var left = 0;
var timer;
run();
function run(){
	if (left <= -1360){
		left = 0;
	}
	var m = Math.floor(-left/340);
	c.style.marginLeft = left + 'px';
	var n = (left % 340 == 0) ? n =3000 : n = 10;
	left -=10;
	timer = setTimeout(run,n);
	icochange(m);
}
function imgchange(n){
	let It = -(n*340);
	c.style.marginLeft = It +'px';
	left = It;
}
eprev.onclick = function(){
	let prevgo =Math.floor(-left/340) - 1;
	if (prevgo == -1) {
		prevgo = 3;
	}
	imgchange(prevgo);
}
enext.onclick = function(){
	let nextgo =Math.floor(-left/340) + 1;
	if (nextgo == 4) {
		nextgo = 0;
	}
	imgchange(nextgo);
}
function icochange(m) {
	for (let index = 0; index < esico.length; index++) {
		esico[index].style.backgroundColor = '';
	}
	if (m < esico.length) {
		esico[m].style.backgroundColor = 'white';
	}
}
eimglist.onmouseover = function() {
	clearTimeout(timer);
}
eimglist.onmouseout = function() {
	run();
}
eicolist3.onclick = function() {
	var p = event.target;
	let ico = -(p.innerHTML-2);
	imgchange(ico);
	icochange(ico);
}
eicolist2.onclick = function() {
	var p = event.target;
	let ico = -(p.innerHTML-1);
	imgchange(ico);
	icochange(ico);
}
eicolist1.onclick = function() {
	var p = event.target;
	let ico = -(p.innerHTML-0);
	imgchange(ico);
	icochange(ico);
}
eicolist4.onclick = function() {
	var p = event.target;
	let ico = -(p.innerHTML-3);
	imgchange(ico);
	icochange(ico);
}


